﻿@model IEnumerable<ABCTile.Models.Color>

@{
    ViewBag.Title = "Index";
}

@Html.ActionLink("Tile", "Index", "Tile") |
@Html.ActionLink("Manufacture", "Index", "Manufacture") |
@Html.ActionLink("Color", "Index", "Color") |
@Html.ActionLink("Shape", "Index", "Shape")

<h2>Color Index</h2>

<p>
    @Html.ActionLink("Create New", "Create")
</p>
@*
<table>
    <tr>
        <th>Color ID</th>
        <th>
            ColorName
        </th>
        <th></th>
    </tr>

@foreach (var item in Model) {
    <tr>
        <td>@Html.DisplayFor(modelItem => item.ColorID)</td>
        <td>
            @Html.DisplayFor(modelItem => item.ColorName)
        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new { id=item.ColorID }) |
            @Html.ActionLink("Details", "Details", new { id=item.ColorID }) |
            @Html.ActionLink("Delete", "Delete", new { id=item.ColorID })
        </td>
    </tr>
}
</table>
*@
<div id = "gridAjax">
    @{

    var grid = new WebGrid(
            source: Model, 
            defaultSort: "ColorID", 
            rowsPerPage: 3, 
            canPage: true, 
            canSort: true,
            ajaxUpdateContainerId: "gridAjax"
        );
    }

    @if (Model.Any())
    {
        @grid.GetHtml(
            tableStyle: "resultTable",
            headerStyle: "head",
            alternatingRowStyle: "alt",
            columns: grid.Columns(
            grid.Column("ColorID"),
            grid.Column("ColorName", 
                format: (item) => Html.ActionLink(((string)item.ColorName), 
                    "Details", new { id = item.ColorID }))
            )
        )
    }
</div>

<script type="text/javascript">
</script>